  <template>
  <el-table
    :data="tableData"
    :stripe="true"
    border
    height="250"
    class="table"
    style="width: 100%"
  >
    <el-table-column prop="date" label="日期" width="180"> </el-table-column>
    <el-table-column prop="name" label="姓名" width="180"> </el-table-column>
    <el-table-column prop="address" label="地址"> </el-table-column>
  </el-table>
</template>

  <script>
/*
1.stripe属性可以创建带斑马纹的表格。它接受一个Boolean，默认为false，设置为true即为启用。
2.默认情况下，Table 组件是不具有竖直方向的边框的，如果需要，可以使用border属性，'/它接受一个Boolean，
设置为true即可启用。


*/
export default {
  name: 'table-putong',
  data () {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1517 弄'
      }, {
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      }, {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }
        , {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }
        , {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }
        , {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }

      ]
    }
  }
}
  </script>
  <style lang="less" scoped>
.table {
  border: 1px solid #000;
}
</style>